<?php
$baseUrl = $this->baseUrl();
?>
<form class="uniForm" style="padding:0.5em 1em 1em 1.5em;">
        <h2>Estate Submission</h2>
        <hr/>
         <div class="ctrlHolder" >
          <p class="label">Select</p>
          <ul class="blockLabels alternate" >
            <li><label for=""><input name="ptype" type="radio" value="property" title="property" class="required" >Property</label></li>
            <li><label for=""><input  name="ptype" type="radio" value="project" title="project" class="required">Project</label></li>
          </ul>
          <p class="formHint">Type</p>
        </div>
      
 </form>
 <form id="dataform" action="javascript:submit();" class="uniForm" style="padding:0.5em 1em 1em 1.5em;display: none;">
 </form>
 <div id="submitStatus" style="display:none;" class="ui-state-highlight ui-corner-all" ></div>
    <script>
	var urlEstateRegister = "<?php echo $this->url(array('controller' => 'estate', 'action' => 'imod'))?>";
	
      $(function(){
        $('form.uniForm').uniform({
          prevent_submit : true
        });

        
        $('#fname').change(function(){
            var cName = this.value;
        	$('.cName').text(cName);
        });

        $('input:radio[name=ptype]').click(function(){
            var form = $('#dataform');
            form.html('');
      	 if(this.value=='property'){
       		form.append(set_property_fields());
      		 }
      	 else{
       		form.append(set_project_fields());
      		 }

        form.append(common());
       	form.append(submitBtn()).slideDown();

       	form.uniform({
          prevent_submit : true
        });
      	 });  
      });

      
        	function set_property_fields()
        	{
        		return  '<div class="ctrlHolder noLabel">'+
		          '<ul class="alternate">'+
		            '<li><label for=""><em>*</em> First Name</label>'+
		          '<input name="fname" id="fname" data-default-value="e.g. Ravi" size="10" maxlength="50" type="text" class="textInput required"/></li>'+
		            '<li><label for=""> Middle Name</label>'+
		          '<input name="mname" id="mname" data-default-value="e.g. Kumar" size="10" maxlength="50" type="text" class="textInput"/></li>'+
		            '<li><label for=""> <em>*</em>Last Name</label>'+
		          '<input name="lname" id="lname" data-default-value="e.g. Gupta" size="10" maxlength="50" type="text" class="textInput required"/></li>'+
		          '</ul>'+
		          '<p class="formHint">Full Name of Owner</p>'+
		        '</div>'+

		        '<div class="ctrlHolder">'+
		          '<label for=""><em>*</em> Owner Contact Number</label>'+
		          '<input name="owner_contact_no" id="owner_contact_no" data-default-value="e.g. 9896102030" size="35" maxlength="50" type="" class="textInput required"/>'+
		          '<p class="formHint">Contact Number of <span class="cName" >Owner</span></p>'+
		        '</div>'+
		        '<div class="ctrlHolder">'+
		          '<label for=""><em>*</em> Owners Address</label>'+
		          '<textarea name="owner_address" id="owner_address" data-default-value="#007, Subhash colony,Faridabad" cols="10" rows="10"  class="textInput required"></textarea>'+
		          '<p class="formHint">Address of <span class="cName" >Owner</span></p>'+
		        '</div>';
			    
        	}

        	function set_project_fields()
        	{
        		return '<div class="ctrlHolder">'+
		          '<label for=""><em>*</em> Project Name</label>'+
		          '<input name="project_name" id="project_name" data-default-value="e.g. Paras Down Town" size="35" maxlength="50" type="" class="textInput required"/>'+
		          '<p class="formHint">Name of<span class="cName" >Project</span></p>'+
		        '</div>'+
				  '<div class="ctrlHolder">'+
		          '<label for=""><em>*</em> Builder</label>'+
		          '<input name="builder" id="builder" data-default-value="e.g. Paras Buildtech" size="35" maxlength="50" type="" class="textInput required"/>'+
		          '<p class="formHint">Name of <span class="cName" >Builder</span></p>'+
		        '</div>'+

		        '<div class="ctrlHolder">'+
		          '<label for=""><em>*</em>Total Area</label>'+
		          '<input name="area" id="area" data-default-value="" size="35" maxlength="50" type="" class="textInput required"/>'+
		          '<p class="formHint">Area of<span class="cName" >Project</span></p>'+
		        '</div>';
        	}

        	function common()
        	{
        		return '<div class="ctrlHolder">'+
                '<label for=""><em>*</em> Category</label>'+
                '<select name="category" id="category" class="selectInput">'+
              		'<option value="RES" selected="selected" >Residential</option>'+
              		'<option value="COM">Commercial</option>'+
      	  		'</select>'+
                '<p class="formHint">Category of <span class="cName" >Propery</span></p>'+
              '</div>'+

              '<div class="ctrlHolder">'+
              '<label for=""><em>*</em> Type</label>'+
              '<select name="type" id="type" class="selectInput">'+
            		'<option value="FLAT" selected="selected" >Flat</option>'+
            		'<option value="PLOT">Plot</option>'+
            		'<option value="SHOP">Shop</option>'+
    	  		'</select>'+
              '<p class="formHint">Type of <span class="cName" >Propery</span></p>'+
            '</div>'+

            '<div class="ctrlHolder">'+
            '<label for=""><em>*</em> Status of property</label>'+
            '<select name="status" id="status" class="selectInput">'+
          		'<option value="NEW" selected="selected" >New</option>'+
          		'<option value="RESAL">Resale</option>'+
  	  		'</select>'+
            '<p class="formHint">Type of <span class="cName" >Propery</span></p>'+
          '</div>'+

          '<div class="ctrlHolder">'+
          '<label for=""><em>*</em>Units Preffered</label>'+
          '<select name="units" id="units" class="selectInput">'+
  			'<option value="sq. foot" selected="selected" >sq. Foot</option>'+
  			'<option value="sq. yard">sq. yard</option>'+
		  '</select>'+
          '<p class="formHint">Units for size of <span class="cName" >Property</span></p>'+
        '</div>'+
          
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>Size</label>'+
                '<input name="size" id="size" data-default-value="" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">Size of <span class="cName" >Property</span> in sq.ft.</p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>BHK</label>'+
                '<input name="bhk" id="bhk" data-default-value="e.g. 3 BHK" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">BHK of <span class="cName" >Property</span></p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>Count</label>'+
                '<input name="count" id="count" data-default-value="1" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">Count of <span class="cName" >Property</span></p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>Rate</label>'+
                '<input name="rate" id="rate" data-default-value="8000" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">Rate for <span class="cName" >Property</span> in /sq.ft.</p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>Location</label>'+
                '<input name="location" id="location" data-default-value="e.g. 365, Model Town" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">Location of <span class="cName" >Property</span></p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>State</label>'+
                '<input name="state" id="state" data-default-value="e.g. Haryana" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">State of <span class="cName" >Property</span></p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>City</label>'+
                '<input name="city" id="city" data-default-value="e.g. Ambala City" size="35" maxlength="50" type="text" class="textInput required"/>'+
                '<p class="formHint">City of <span class="cName" >Property</span></p>'+
              '</div>'+
              
              '<div class="ctrlHolder">'+
                '<label for=""><em>*</em>Summary</label>'+
                '<textarea name="summary" id="summary" data-default-value="Well furnished,24hour services,near bus stand...etc" cols="35" rows="10" class="textInput required"/>'+
                '<p class="formHint">Summary of <span class="cName" >Property</span>. 500 words</p>'+
              '</div>';
        	}

        	function submitBtn() {
                
                return '<div class="buttonHolder">'+
                '<button type="submit" class="secondaryAction">Cancel and go back</button>'+
                '<button type="submit" class="primaryAction">Submit</button>'+
              '</div>';
			}

        	function submit() {
                $.ajax({
                    url : urlEstateRegister,
                    data : getValues(),
                    success: function(jStatus){
                        $( "#submitStatus" ).text(jStatus).toggle( 'blind', '', 'slow', function(){
                          	setTimeout(function(){
                              	window.location.reload();
                              	},1400);
                          } );
                      },
                        error: function(response) {
                      	  $('#errorBox').text(response.responseText).parent().show();
                            console.log(response);
                            }
                        });
            }
            function getValues() {
            	var ptype = $('input:radio[name=ptype]:checked').val();
                var formData = {ptype:ptype,
                        		oper:'add'}; 
                $('#dataform :input')
                		.not('button')
                		.each(function(){ 
                			formData[this.name] = this.value; 
                    });
      		return formData;
      	}
        </script>
<?php
$this->headScript()->appendFile($baseUrl.'/plugins/uni-form/js/uni-form-validation.jquery.js');
$this->headLink()->prependStylesheet($baseUrl.'/plugins/uni-form/css/uni-form.css');
$this->headLink()->prependStylesheet($baseUrl.'/plugins/uni-form/css/smooth.uni-form.css');
$this->headLink()->prependStylesheet($baseUrl.'/plugins/uni-form/demos/css/demo.css');
?>